<!--  -->
<template>
    <div class='page-main'>
        <CustomForm :formInline="formInline" @onSubmit="onSubmit" @resetTable="resetTable" :btnOnLine="true">
            <el-form-item label="总运单ID">
                <el-input v-model="formInline.add_id" placeholder="请输入运单ID"></el-input>
            </el-form-item>
            <el-form-item label="分运单ID">
                <el-input v-model="formInline.id" placeholder="请输入运单ID"></el-input>
            </el-form-item>
            <el-form-item label="状态">
                <el-select v-model="formInline.type" placeholder="请选择" @change="selectTypeHandle">
                    <el-option v-for="item in options" :key="item.value" :label="item.name" :value="item.value">
                    </el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="司机姓名">
                <el-input v-model="formInline.name" placeholder="请输入司机姓名"></el-input>
            </el-form-item>

            <el-form-item label="公司名称" v-if="false">
                <!-- <el-input v-model="formInline.company_name" placeholder="请输入公司名称"></el-input> -->
                <el-select v-model="formInline.company_name" placeholder="选择公司名称" clearable @change="selectCompanyName">
                    <el-option v-for="(item, index) in ahCompanyList" :label="item" :value="item"
                        :key="index"></el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="车牌号">
                <el-input v-model="formInline.car_name" placeholder="请输入车牌号"></el-input>
            </el-form-item>

            <el-form-item label="手机号">
                <el-input v-model="formInline.phone" placeholder="请输入手机号"></el-input>
            </el-form-item>

            <el-form-item label="接单时间">
                <el-date-picker v-model="pickerDateArr" type="daterange" range-separator="至" start-placeholder="开始日期"
                    end-placeholder="结束日期" value-format="yyyy-MM-dd" @change="changeDatePicker"></el-date-picker>
            </el-form-item>

            <el-form-item label="发货地">
                <el-cascader v-model="searchAddressStart" :props="{ checkStrictly: true }" clearable
                    :options="regionData" style="width: 100%;" />
            </el-form-item>
            <el-form-item label="收货地">
                <el-cascader v-model="searchAddressEnd" :props="{ checkStrictly: true }" clearable :options="regionData"
                    style="width: 100%;" />
            </el-form-item>
            <el-form-item label="搜索公司">
                <el-input v-model="formInline.company_search" placeholder="请输入公司名称"></el-input>
            </el-form-item>
            
            <el-form-item label="货物名称">
                <el-input v-model="formInline.goods" placeholder="请输入货物名称"></el-input>
            </el-form-item>
   
            <el-form-item label="卸货时间">
                <el-date-picker v-model="pickerDateArrEnd" type="daterange" range-separator="至" start-placeholder="开始日期"
                    end-placeholder="结束日期" value-format="yyyy-MM-dd" @change="changeDatePicker"></el-date-picker>
            </el-form-item>

            <el-form-item label="所属地区">
                <el-select v-model="formInline.area_status" placeholder="选择所属公司" @change="selectArea">
                    <el-option label="全部" :value="-1"></el-option>
                    <el-option v-for="(item, index) in getOfficesList" :key="item" :label="item"
                        :value="index"></el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="锁定状态">
                <el-select v-model="formInline.is_lock" placeholder="选择锁定状态" @change="selectArea">
                <el-option label="全部" :value="0"></el-option>
                <el-option label="未锁定" :value="1"></el-option>
                <el-option label="已锁定" :value="2"></el-option>
                </el-select>
            </el-form-item>
            <template slot="btnBoxHeader">
                <el-button type="success" @click="batchWaybillStatus">批量修改运单状态</el-button>
            </template>
        </CustomForm>
        <CustomDescriptions :data="descriptionsData" :styleBox="{}"></CustomDescriptions>


        <el-table :data="list" style="width: 100%" height="520" v-loading="tableLoading"
            @selection-change="handleSelectionChange">
            <el-table-column align="center" width="80">
                <template slot-scope="scope">
                    <!-- <svg v-if="false"
                        style="width: 3em;height:1rem;vertical-align: -0.15em;fill: currentColor;overflow: hidden;"
                        aria-hidden="true">
                        <use xlink:href="#icon-prePayIcon" />
                    </svg > -->
                    <!-- 异常状态 -->
                    <StatusTag v-if="scope.row.error_status > 0" :isError="true" :status="scope.row.error_status" :yund_id="scope.row.id" />
                    
                    <!-- 锁定状态 -->
                    <StatusTag v-if="scope.row.is_lock == 1" :isError="true" :status="5" :lockReason="scope.row.reason" :yund_id="scope.row.id" />
                    
                    <!-- 预支付状态 -->
                    <StatusTag :status="scope.row.advance_payment_status" :yund_id="scope.row.id" />
                </template>
            </el-table-column>
            
            <el-table-column type="selection" width="25" :selectable="selectableStatus">
            </el-table-column>
            <el-table-column prop="area_company" label="所属地区" width="100" align="center">
            </el-table-column>
            <el-table-column prop="id" label="运单ID" width="100" align="center">
                <template slot-scope="scope">
                    <span @click="openViewWaybillInfo(scope.row.add_id)" style="cursor: pointer;">{{ scope.row.add_id +
                        '-' + scope.row.id
                        }}</span>
                </template>
            </el-table-column>
            <el-table-column prop="sj_name" label="司机姓名" width="80" align="center">
                <template slot-scope="scope">
                        {{ $maskString(scope.row.sj_name) }}
                </template>
            </el-table-column>
            <el-table-column prop="mobile" label="手机号" align="center" :show-overflow-tooltip="true">
            </el-table-column>
            <el-table-column prop="cph" label="车牌号" align="center" :show-overflow-tooltip="true">
            </el-table-column>
            <el-table-column prop="company_name" label="公司名称" align="center" :show-overflow-tooltip="true">
            </el-table-column>
            <el-table-column prop="goods" label="货物名称" align="center" :show-overflow-tooltip="true">
            </el-table-column>
            <el-table-column prop="ship_address" label="发货地" :show-overflow-tooltip="true" align="center">
            </el-table-column>
            <el-table-column prop="to_address" label="收货地" :show-overflow-tooltip="true" align="center">
            </el-table-column>
            <el-table-column prop="th_time" label="提货时间" :show-overflow-tooltip="true" align="center">
                <template slot-scope="scope">
                    <span v-if="scope.row.status == '0'">---</span>
                    <span v-else>{{ scope.row.th_time }}</span>
                </template>
            </el-table-column>
            <el-table-column prop="dd_time" label="卸货时间" :show-overflow-tooltip="true" align="center">
                <template slot-scope="scope">
                    <span v-if="[4, 5, 6, 7].includes(scope.row.status)">{{ scope.row.dd_time }}</span>
                    <span v-else>--</span>
                </template>
            </el-table-column>
            <el-table-column prop="unit_price" label="运费单价" width="80" align="center">
            </el-table-column>
            <el-table-column prop="kg" label="发货重量" align="center" width="80">
                <template slot-scope="scope">
                    <!-- <span :style="{ color: (scope.row.kg ? '' : 'red') }">{{ scope.row.kg }}</span> -->
                    <span :style="{ color: 'green' }">{{ scope.row.kg }}</span>
                </template>
            </el-table-column>
            <el-table-column prop="unloading_weight" label="卸货重量" align="center" width="80">
                <template slot-scope="scope">
                    <span :style="{ color: 'blue' }">{{ scope.row.unloading_weight
                        }}</span>
                </template>
            </el-table-column>
            <el-table-column prop="price" label="运费" align="center" width="80">
            </el-table-column>
            <el-table-column prop="status" label="状态" width="80" align="center">
                <template slot-scope="scope">
                    <span v-if="scope.row.status == '0'">待提货</span>
                    <span v-else-if="scope.row.status == '1'">拒绝</span>
                    <span v-else-if="scope.row.status == '2'">确认</span>
                    <span v-else-if="scope.row.status == '3'" style="color:blue">运输中</span>
                    <span v-else-if="scope.row.status == '4'" style="color:green">完成</span>
                    <span v-else-if="scope.row.status == '5'" style="color:#ff9900">待结算</span>
                    <span v-else-if="scope.row.status == '6'" style="color:green">结算</span>
                    <span v-else-if="scope.row.status == '7'">结算失败</span>
                </template>
            </el-table-column>
            <el-table-column prop="address" label="操作" width="240" align="center">
                <template slot-scope="scope">
                    <el-button type="primary" size="mini" v-if="[3, 4, 5, 6, 7].includes(scope.row.status)"
                        @click="openTrace(scope.row)">轨迹</el-button>
                    <el-button type="primary" size="mini" @click="returnHandle(scope.row.id)">回单</el-button>
                    <!-- <el-button type="primary" size="mini" 
                        @click="checkWaybillHandle(scope.row)">核对运单</el-button> -->
                    <el-button type="primary" size="mini" :disabled="scope.row.error_status > 0 || scope.row.is_lock == 1" v-if="[4].includes(scope.row.status) "
                        @click="checkWaybillHandle(scope.row)">核对运单</el-button>
                    <el-dropdown trigger="click">
                        <span class="el-dropdown-link">
                            <i class="el-icon-arrow-down el-icon--right"></i>
                        </span>
                        <el-dropdown-menu slot="dropdown" class="in-page-dropdown">
                            <el-dropdown-item>
                                <el-button type="primary" size="mini" 
                                    @click="lockBill(scope.row)">{{scope.row.is_lock == 1 ? '解锁' : '锁定'}}</el-button>
                            </el-dropdown-item>
                            <el-dropdown-item>
                                <el-button type="primary" size="mini" v-if="scope.row.is_log == 1"
                                    @click="checkBillStatus(scope.row)">运单日志</el-button>
                            </el-dropdown-item>
                            <el-dropdown-item>
                                <el-button type="primary" size="mini"
                                    @click="contractHandler({ user_id: scope.row.user_id, htsn: scope.row.HTsn, yund_id: scope.row.id })">合同链接</el-button>
                            </el-dropdown-item>
                            <el-dropdown-item>
                                <el-button type="primary" size="mini"
                                    @click="driverPosition(scope.row.id)">司机位置</el-button>
                            </el-dropdown-item>
                            <el-dropdown-item>
                                <el-button type="primary" size="mini"
                                    @click="showUpdateDialog(scope.row)">修改发货重量</el-button>
                            </el-dropdown-item>
                            <!-- v-if="[4,5].includes(scope.row.status) && scope.row.error_status == 0" -->
                            <el-dropdown-item>
                                <el-button type="primary" size="mini" 
                                v-if="[4,5].includes(scope.row.status) && scope.row.apply_bill_status == 0"
                                    @click="openOrderTemp(scope.row)">发起审批</el-button>
                            </el-dropdown-item>
                            <el-dropdown-item>
                                <el-button type="primary" size="mini" 
                                v-if="[4,5,6].includes(scope.row.status) && scope.row.apply_bill_status > 0"
                                    @click="openOrderTemp(scope.row)">审批流程</el-button>
                            </el-dropdown-item>
                            <el-dropdown-item>
                                <el-button type="danger" size="mini" v-if="![4,5,6].includes(scope.row.status)"
                                    @click="deleteSubBill(scope.row.id)">删除</el-button>
                            </el-dropdown-item>
       
                        </el-dropdown-menu>
                    </el-dropdown>
                </template>
            </el-table-column>
        </el-table>

        <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
            :current-page.sync="formInline.page" :page-sizes="[10, 20, 30, 50]" :page-size="formInline.pageSize"
            layout="total, sizes, prev, pager, next, jumper" :total="total">
        </el-pagination>

        <el-dialog title="查看回单" :visible.sync="dialogReceipts" width="60%" :close-on-click-modal="true" :before-close="returnHandleClose"
            :modal="true">
            <div class="imgbox3">
                <div class="block">
                    <div class="demonstration">发货单：</div>
                    <!-- <el-upload class="avatar-uploader" :action="uploadUrl" :show-file-list="false"
                        :on-success="(res, file) => handleAvatarSuccess(res, file, 'fahuo')"
                        :before-upload="beforeAvatarUpload" :on-preview="handlePictureCardPreview"
                        :on-remove="handleRemove">
                        <img v-if="viewReceiptsImgs.pic" :src="viewReceiptsImgs.pic" class="avatar">
                        <i v-else class="el-icon-plus avatar-uploader-icon"></i>
                    </el-upload> -->

                    <uploadImgPrev :textType="'fahuo'" @getImageList="getImageList" :imageList="[viewReceiptsImgs.pic]">
                    </uploadImgPrev>

                </div>

                <div class="block">
                    <div class="demonstration">收货单：</div>
                    <uploadImgPrev :textType="'shouhuo'" @getImageList="getImageList"
                        :imageList="[viewReceiptsImgs.shd]">
                    </uploadImgPrev>
                </div>

                <div class="block">
                    <div class="demonstration">卸货照片：</div>
                    <uploadImgPrev :textType="'xiehuo'" @getImageList="getImageList"
                        :imageList="[viewReceiptsImgs.xh_img]">
                    </uploadImgPrev>
                </div>

            </div>
            <span slot="footer" class="dialog-footer">
                <el-button @click="dialogReceipts = false">取 消</el-button>
                <el-button type="primary" @click="updateViewReceiptHandle">保 存</el-button>
            </span>
        </el-dialog>



        <el-dialog class="carTrace" title="查看轨迹" top="5vh" :close-on-click-modal="true" :visible.sync="checkTrace" width="70%" :modal="true"
            :before-close="CarTraceHandleClose">
            <CarTrace ref="carTrace" v-if="checkTrace" :id="traceId" :row="traceRow"  />
        </el-dialog>

        <el-dialog title="核对运单" class="checkWaybill" :close-on-click-modal="true" :visible.sync="checkWaybillDialog" width="80%" top="8vh">
            <CheckWaybill v-if="checkWaybillDialog" :billDetail="billDetail" @refreshTable="refreshTable" />
        </el-dialog>

        <el-dialog :title="templateRow.orderInfo.apply_bill_status == 0 ? '发起审批' : '审批流程' " :close-on-click-modal="true" class="carTrace" top="5vh" :visible.sync="templateDialog" width="80%">
            <orderTemplate v-if="templateDialog" :row="templateRow" @refreshTable="refreshTable" />
        </el-dialog>

        <el-dialog title="运单日志" class="carTrace1" top="20vh" :close-on-click-modal="true" :visible.sync="billStausDialog" width="25%">
            <billStatus v-if="billStausDialog" :row="billStatusInfo" @refreshTable="refreshTable" />
        </el-dialog>

        <el-dialog title="司机位置" class="carTrace" top="5vh" :close-on-click-modal="true" :visible.sync="driverPositionDialog" width="80%"
            :before-close="driverPositionHandleClose">
            <DriverPositionDialog ref="DriverPositionDialog" v-if="driverPositionDialog" :id="yun_id"
                @refreshTable="refreshTable" />
        </el-dialog>

        <el-dialog title="查看运单信息" class="show-dialog-waybill" top="4vh" :visible.sync="dialogVisible" width="80%">
            <dialogWaybillList v-if="dialogVisible" :id="waybillDetail.id">
            </dialogWaybillList>
        </el-dialog>
        <el-dialog title="修改运单发货重量" :visible.sync="updateDialogVisible" width="30%">
            <el-form label-width="80px" :model="updateForm">
                <el-form-item label="吨数" class="flex">
                    <el-input-number v-model="updateForm.kg" :precision="3" :step="0.001"></el-input-number>
                    <div class="unit">吨</div>
                </el-form-item>
            </el-form>
            <span slot="footer" class="dialog-footer">
                <el-button @click="updateDialogVisible = false">取 消</el-button>
                <el-button type="primary" @click="updateShippingWeight">确 定</el-button>
            </span>
        </el-dialog>
    </div>
</template>

<script>
import { regionData } from "element-china-area-data";
import { getCodeToText,timestampToTime } from '@/utils/tool';
import {getOfficesList} from '@/utils/auth';
import { updateShippingWeight,getContractLink,getSubBillList, waybillDetails, viewReceipts, updateViewReceipts, getAhCompanyList, updateBillStatus, deleteSubBill,freightTemplateDetail,LockSubWayBill } from '@/api/childCompany/waybill';
import CarTrace from "@/components/CarTrace/CarTrace.vue";
import uploadImgPrev from "@/components/uploadImgPrev/index.vue";
import DriverPositionDialog from "@/components/DriverPositionDialog/index.vue";
// import ViewWaybillInfo from "@/components/ViewWaybillInfo/index.vue";
import CheckWaybill from "./components/checkWaybill.vue";
import dialogWaybillList from './components/dialogWaybillList.vue';
import orderTemplate from './components/orderTemplate.vue';
import billStatus from './components/billStatus.vue';
export default {
    //import引入的组件需要注入到对象中才能使用
    components: {
        CarTrace,
        CheckWaybill,
        uploadImgPrev,
        DriverPositionDialog,
        dialogWaybillList,
        orderTemplate,
        billStatus
    },
    data() {
        //这里存放数据
        return {
            templateDialog:false,//运单模版弹框
            templateRow:{
                orderInfo:{},
            },
            billStausDialog:false,//运单步骤弹框
            billStatusInfo:null,//运单步骤详情
            regionData,
            traceId:'',
            traceRow:'',
            getOfficesList: getOfficesList(),
            formInline: {
                is_lock:0,
                id: "",//id搜索
                add_id: '',//分运单id
                type: -1,
                time: '',
                endTime: "",
                name: "",
                car_name: "",
                phone: "",
                page: 1,
                pageSize: 10,
                company_search: "",
                company_name: "",
                start_province: "",
                start_city: "",
                end_province: "",
                end_city: "",
                sfd: "",
                zd: "",
                reach_time: "",//卸货时间
                area_status: 0,
                goods:'',
            },
            options: [
                {
                    name: '全部',
                    value: -1
                },
                {
                    name: '待提货',
                    value: 0
                },
                {
                    name: '运输中',
                    value: 3
                },
                {
                    name: '已完成',
                    value: 4
                },
                {
                    name: '待结算',
                    value: 5
                },
                {
                    name: '已结算',
                    value: 6
                },
            ],
            list: [],//分运单列表
            pickerDateArr: "",
            pickerDateArrEnd: "",
            tableLoading: false,
            total: 0,
            checkTrace: false,

            dialogReceipts: false,//回单dialog显示

            viewReceiptsImgs: {//回单的三张图片
                pic: "",
                shd: "",
                xh_img: "",
                id: ""
            },
            checkWaybillDialog: false,//核对运单
            billDetail: {},//核对运单数据

            descriptionsData: [
                {
                    label: "总单数",
                    count: 0,
                    unit: "(单)"
                },
                {
                    label: "总吨数",
                    count: 0,
                    unit: "(吨)"
                },
                {
                    label: "总金额",
                    count: 0,
                    unit: "(元)"
                },
            ],

            ahCompanyList: [],//总公司公司列表

            searchAddressStart: '',//始发地选择
            searchAddressEnd: '',//终点选择

            multipleSelection: [],

            driverPositionDialog: false,

            yun_id: '',

            dialogVisible: false,//查看运单的dialog

            waybillDetail: {
                id: '',
            },
            
            updateDialogVisible: false,//修改发货运单重量的弹框
            updateForm: {
                sub_id: "",
                kg: "",
            }
        };
    },
    //监听属性 类似于data概念
    computed: {},
    //监控data中的数据变化
    watch: {
        pickerDateArr: {
            handler(newV, oldV) {
                if (newV) {
                    this.formInline.time = newV[0]
                    this.formInline.endTime = newV[1]
                } else {
                    this.formInline.time = ''
                    this.formInline.endTime = ''
                }
            }
        },
        pickerDateArrEnd: {//卸货时间
            handler(newV, oldV) {
                if (newV) {
                    this.formInline.reach_time = newV.join(' - ');
                } else {
                    this.formInline.reach_time = '';
                }
            }
        },
        searchAddressStart: {
            handler(newV, oldV) {
                let res = getCodeToText(newV);
                this.formInline.start_province = '';
                this.formInline.start_city = '';
                this.formInline.sfd = '';

                if (newV.length >= 1) {
                    this.formInline.start_province = res[0];
                }
                if (newV.length >= 2) {
                    if (res[0].includes('市')) {
                        this.formInline.start_city = res[0];
                    } else {
                        this.formInline.start_city = res[1].substring(0, res[1].length - 1);
                    }
                }
                if (newV.length == 3) {
                    this.formInline.sfd = newV[2]
                }
            }
        },
        searchAddressEnd: {
            handler(newV, oldV) {
                let res = getCodeToText(newV);
                this.formInline.end_province = '';
                this.formInline.end_city = '';
                this.formInline.zd = '';

                if (newV.length >= 1) {
                    this.formInline.end_province = res[0];
                }
                if (newV.length >= 2) {
                    if (res[0].includes('市')) {
                        this.formInline.end_city = res[0];
                    } else {
                        this.formInline.end_city = res[1].substring(0, res[1].length - 1);
                    }
                }
                if (newV.length == 3) {
                    this.formInline.zd = newV[2]
                }
            }
        },
        'formInline.company_search': {
            handler(newV, oldV) {
                if (newV) {
                    this.formInline.company_name = "";
                }
            }
        }
    },
    //方法集合
    methods: {
        //获取一个月前的时间戳
        getOneMonthAgoTimestamp(){
            // const now = new Date(); // 当前时间
            // now.setMonth(now.getMonth() - 1); // 设置为一个月前的时间
            // return now.getTime(); // 获取时间戳
            // 获取当前时间的时间戳
            let currentTimestamp = Date.now();
            // 获取一天的毫秒数
            let oneDayInMilliseconds = 24 * 60 * 60 * 1000;
            // 计算一天前的时间戳
            let oneDayAgoTimestamp = currentTimestamp - oneDayInMilliseconds;
            return oneDayAgoTimestamp;
        },
        refreshTable() {
            this.templateDialog = false;
            this.checkWaybillDialog = false;
            this.getSubBillList();
        },
        async contractHandler(data) {
            let res = await getContractLink(data);
            if (res.code == 200) {
                window.open(res.url, "_blank");
            }
        },
        async getSubBillList() {
            this.tableLoading = true;
            let res = await getSubBillList(this.formInline);
            if (res.code == 200) {
                this.list = res.data;
                this.total = res.extra.total;
                this.descriptionsData[0].count = this.total;
                this.descriptionsData[1].count = res.extra.weight;
                this.descriptionsData[2].count = res.extra.total_price;
            }
            this.tableLoading = false;
        },

        //锁定或解锁订单
        lockBill(row){
            if(row.is_lock == 1){
                //解锁
                this.$confirm(`确定要解锁此订单吗？`, {
                    confirmButtonText: "确定",
                    cancelButtonText: "取消",
                    type: "warning"
                })
            .then(async () => {
                let res = await LockSubWayBill({
                    is_lock: 0,
                    id: row.id
                });
                if (res.code == 200) {
                    this.$message.success('操作成功！');
                    this.getSubBillList();
                }
                }).catch(() => {});
            }else{
                //锁定
                this.$prompt('请输入锁定理由', '锁定运单', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    inputPlaceholder:'锁定理由',
                    inputValidator:(val)=>{
                    return val ? true : '锁定理由不能为空!'
                    },
                }).then(async ({ value }) => {
                    let res = await LockSubWayBill({
                    is_lock: 1,
                    id: row.id,
                    reason:value
                });
                if (res.code == 200) {
                    this.$message.success('操作成功！');
                    this.getSubBillList();
                }
                }).catch(() => {  
                });
            }
        },
        openTrace(row){
            this.traceRow = row; 
            this.traceId = row.id;
            this.checkTrace = true
        },
        onSubmit() {
            this.formInline.page = 1;
            this.getSubBillList();
        },
        resetTable() {
            this.formInline = {
                is_lock:"",
                id: "",
                add_id: "",
                type: -1,
                time: '',
                endTime: "",
                name: "",
                car_name: "",
                phone: "",
                page: 1,
                pageSize: 10,
                company_search: "",
                company_name: "",
                start_province: "",
                start_city: "",
                end_province: "",
                end_city: "",
                sfd: "",
                zd: "",
                reach_time: "",//卸货时间
                area_status: 0,
            };
            this.pickerDateArr = "";
            this.searchAddressStart = [];
            this.searchAddressEnd = [];
            this.pickerDateArr = [];
            this.pickerDateArrEnd = [];
            this.getSubBillList();
        },
        changeDatePicker() {//日期选择完的回调

            this.$nextTick(() => {
                this.getSubBillList();
            })
        },
        async openOrderTemp(row){
            let result = await freightTemplateDetail({ id: row.id });
            console.log('result',result);
            if(result.code == 200){
                this.templateRow = {
                    ...result.data,
                    orderInfo:row
                };
                this.templateDialog = true;
            }

        },
        handleCurrentChange(page) {//改变page回调
            this.formInline.page = page;
            this.getSubBillList();
        },
        handleSizeChange(pageSize) {//改变pageSize
            this.formInline.pageSize = pageSize;
            this.formInline.page = 1;
            this.getSubBillList();
        },
        selectTypeHandle() {//form表单中的选择类型的回调
            this.getSubBillList();
        },
        async returnHandle(id) {
            let res = await viewReceipts({ id });
            this.viewReceiptsImgs = res.data;
            this.viewReceiptsImgs.id = id;
            this.dialogReceipts = true;
        },
        returnHandleClose() {
            this.dialogReceipts = false;
        },

        getImageList(list, index) {
            console.log(list[0]);
            if (list[0].name == 'fahuo') {
                this.viewReceiptsImgs.pic = list[0].url
            } else if (list[0].name == 'shouhuo') {
                this.viewReceiptsImgs.shd = list[0].url;
            } else if (list[0].name == 'xiehuo') {
                this.viewReceiptsImgs.xh_img = list[0].url;
            }
        },
        async updateViewReceiptHandle() {
            let res = await updateViewReceipts(this.viewReceiptsImgs);
            if (res.code == 200) {
                this.$message.success(res.msg);
                this.dialogReceipts = false;
            }
        },
        async checkWaybillHandle(row) {
            let result = await waybillDetails({ id: row.id });
            if (result.code == 200) {
                this.billDetail = result.data;
                this.checkWaybillDialog = true;
            }
        },
        selectCompanyName(value) {
            this.formInline.company_search = '';
            this.getSubBillList();
        },
        async getAhCompanyList() {
            let res = await getAhCompanyList();
            if (res.code == 200) {
                this.ahCompanyList = res.data;
            }
        },
        selectArea() {
            this.getSubBillList();
        },
        batchWaybillStatus() {//批量修改运单状态
            let length = this.multipleSelection.length;
            if (length == 0) {
                this.$message.error('请先选中要修改的数据!')
                return
            } else if (length > 1) {
                let companyName = this.multipleSelection[0].company_name;
                let companyNameEvery = this.multipleSelection.every((item) => {
                    return item.company_name == companyName;
                })
                if (!companyNameEvery) {
                    this.$message.error('只能选中同一家公司数据!')
                    return
                }
            }
            // this.multipleSelection.
            this.$confirm('确定批量修改吗？', '系统提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(async () => {
                let ids = this.multipleSelection.reduce((prev, curr, index) => {
                    return prev + curr.id + (index == this.multipleSelection.length - 1 ? '' : ',')
                }, "")
                const loading = this.$loading({
                    lock: true,
                    text: '请求中...',
                    spinner: 'el-icon-loading',
                    background: 'rgba(0, 0, 0, 0.7)',
                });
                let res = await updateBillStatus({
                    id: ids
                });
                loading.close();
                if (res.code == 200) {
                    this.$message.success(res.msg)
                } else {
                    this.$message.error(res.msg)
                }
                this.getSubBillList();
            }).catch(() => { });
        },
        handleSelectionChange(val) {
            console.log(val);
            this.multipleSelection = val;
        },
        selectableStatus(row, index) {
            //订单锁定
            if(row.is_lock == 1){
                return false
            }
            //订单异常
            if(row.error_status != 0){
                return false
            }
            //
            else if (row.status == 4) {
                return true
            } else{
                return false
            }
        },
        CarTraceHandleClose() {//CarTrace组件关闭的回调,用地图组件的地方必须要写,不要然会造成内存泄露

            if (this.$refs.carTrace.traceMap) {
                this.$refs.carTrace.traceMarker.stopMove(); //先暂停轨迹动画然后再销毁 否则报错
                this.$refs.carTrace.traceMap.destroy();
            }
            this.checkTrace = false;
        },
        driverPositionHandleClose() {//CarTrace组件关闭的回调,用地图组件的地方必须要写,不要然会造成内存泄露
            if (this.$refs.DriverPositionDialog.traceMap) {
                //this.$refs.DriverPositionDialog.traceMarker.stopMove(); //先暂停轨迹动画然后再销毁 否则报错
                this.$refs.DriverPositionDialog.traceMap.destroy();
            }
            this.driverPositionDialog = false;
        },
        driverPosition(id) {
            this.yun_id = id;

            this.driverPositionDialog = true;
        },

        openViewWaybillInfo(id) {
            this.waybillDetail.id = id;
            //打开查看运单信息弹窗
            this.dialogVisible = true;
        },
        checkBillStatus(row){
            this.billStatusInfo = row
            this.billStausDialog = true;
        },
                //修改发货重量
         showUpdateDialog(row) {
            this.updateForm.sub_id = row.id;
            this.updateForm.kg = row.kg;
            this.updateDialogVisible = true;
        },
        async deleteSubBill(id) {
            this.$confirm('确定删除该分运单?', '提示', {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning"
            }).then(async () => {
                let res = await deleteSubBill({
                    id
                })
                if (res.code == 200) {
                    this.$message.success(res.msg)
                    this.getSubBillList();
                } else {
                    this.$message.error(res.msg)
                }
            }).catch(() => {

            })

        },
          //修改发货重量
         async updateShippingWeight() {
            if (this.updateForm.kg <= 0 || !this.updateForm.kg) {
                this.$message.error('请输入正确的发货重量!')
                return;
            }
            let res = await updateShippingWeight(this.updateForm);
            if (res.code == 200) {
                this.$message.success(res.msg);
            } else {
                this.$message.error(res.msg);
            }
            this.updateDialogVisible = false;
            this.getSubBillList();
        },
    },
    //生命周期 - 创建完成（可以访问当前this实例）
    created() {

    },
    //生命周期 - 挂载完成（可以访问DOM元素）
    mounted() {
        if (this.$route.query.id && this.$route.query.add_id) {
            //从聚合查询跳转过来的 不再限定一个月时间
            this.formInline.id = this.$route.query.id;
            this.formInline.add_id = this.$route.query.add_id;
        }else{
            //时间限定一个月
            let prevTime = this.getOneMonthAgoTimestamp();
            let currentTime = Date.now();
            this.pickerDateArrEnd = [timestampToTime(prevTime),timestampToTime(currentTime)];
            this.formInline.reach_time = this.pickerDateArrEnd.join(' - ')
        }

        this.getSubBillList();
        // this.getAhCompanyList();
    },
    beforeCreate() { }, //生命周期 - 创建之前
    beforeMount() { }, //生命周期 - 挂载之前
    beforeUpdate() { }, //生命周期 - 更新之前
    updated() { }, //生命周期 - 更新之后
    beforeDestroy() { }, //生命周期 - 销毁之前
    destroyed() { }, //生命周期 - 销毁完成
    activated() { }, //如果页面有keep-alive缓存功能，这个函数会触发
}
</script>
<style lang='scss' scoped>
//@import url(); 引入公共css类

::v-deep .el-pagination {
    margin-top: 20px;
}

.carTrace {
    ::v-deep .el-dialog {
        height: 85vh;

        .el-dialog__body {
            height: calc(85vh - 55px);
            overflow: auto;
        }
    }
}

.imgbox3 {
    display: flex;

    .block {
        display: flex;
        padding: 30px;
        width: 30%;
        height: 300px;
        overflow: hidden;
    }

    .demonstration {
        width: 40%;
    }
}

::v-deep .el-table .el-table__cell {
    padding: 10px 0;

    .cell {
        padding-left: 2px;
        padding-right: 2px;
    }
}
::v-deep .el-input-number {
    width: 100%;

    .el-input-number__decrease {
        display: none;
    }

    .el-input-number__increase {
        display: none;
    }

    .el-input__inner {
        text-align: left;
        padding: 0 20px;
    }
}
::v-deep .flex {
    padding: 0 10%;

    .el-form-item__content {
        display: flex;
        width: 80%;
    }
    .unit {
        height: 40px;
        padding: 0 20px;
        transform: scaleX(1.02);
        background-color: #f5f7fa;
        color: #999;
        border: 1px solid #DCDFE6;
        border-top-right-radius: 5px;
        border-bottom-right-radius: 5px;
    }
}


</style>